<template>
	<el-dialog v-model="dialogVisible" width="80%" title="报表创建向导">
		<ModuleTypeSelectPage ref="moduleTypeSelectPage" :scope="scope"></ModuleTypeSelectPage>
		<ReportTypeSelectPage ref="reportTypeSelectPage" :scope="scope"></ReportTypeSelectPage>
		<ReportBaseInfoPage ref="reportBaseInfoPage" :scope="scope"></ReportBaseInfoPage>
		<div
			style="display: flex;justify-content: space-between;margin-top: 10px;border-top: 1px solid #ddd;padding-top: 10px;">
			<div>
				<el-button type="primary" @click="onPreviousClickHandler" size="small" v-show="currentPageIndex>0">上一步
				</el-button>
			</div>
			<div>
				<el-button type="primary" @click="onNextClickHandler" size="small" v-if="!showFinishButton">下一步
				</el-button>
				<el-button type="primary" @click="onFinishClickHandler" size="small" v-if="showFinishButton">完成
				</el-button>
			</div>
		</div>
	</el-dialog>
</template>

<script>
	import ModuleTypeSelectPage from './ModuleTypeSelectPage.vue';
	import ReportTypeSelectPage from './ReportTypeSelectPage.vue';
	import ReportBaseInfoPage from './ReportBaseInfoPage.vue';
	import restUtil from '@/utils/restUtil.js';
	export default {
		name: "ReportWizardDialog",
		components: {
			ModuleTypeSelectPage,
			ReportTypeSelectPage,
			ReportBaseInfoPage
		},
		props: [],
		data() {
			return {
				dialogVisible: false,
				currentPageIndex: 0,
				pageList: [],
				scope: {},
				showFinishButton: false,
			}
		},
		mounted() {

		},
		methods: {
			init() {
				this.$nextTick(function() {
					this.pageList = ["moduleTypeSelectPage", "reportTypeSelectPage",
						"reportBaseInfoPage"
					];
					for (var i = 0; i < this.pageList.length; i++) {
						this.scope[this.pageList[i]] = {};
					}
					this.currentPageIndex = 0;
					this.refreshVisual();
				});
			},
			refreshVisual() {
				for (var i = 0; i < this.pageList.length; i++) {
					if (i == this.currentPageIndex) {
						this.$refs[this.pageList[i]].setVisible(true);
					} else {
						this.$refs[this.pageList[i]].setVisible(false);
					}
					var currentPage = this.$refs[this.pageList[this.currentPageIndex]];
					if (currentPage.isCompletedPage()) {
						this.showFinishButton = true;
					} else {
						this.showFinishButton = false;
					}
				}
			},
			setVisible(visible) {
				this.dialogVisible = visible;
			},
			onNextClickHandler() {
				var currentPage = this.$refs[this.pageList[this.currentPageIndex]];
				this.scope[this.pageList[this.currentPageIndex]] = currentPage.getReturnData();
				var nextPageName = currentPage.getNextPage();
				for (var i = 0; i < this.pageList.length; i++) {
					if (this.pageList[i] == nextPageName) {
						this.currentPageIndex = i;
						break;
					}
				}
				this.refreshVisual();
			},
			onPreviousClickHandler() {
				var currentPage = this.$refs[this.pageList[this.currentPageIndex]];
				this.scope[this.pageList[this.currentPageIndex]] = currentPage.getReturnData();
				var previousPageName = currentPage.getPreviousPage();
				for (var i = 0; i < this.pageList.length; i++) {
					if (this.pageList[i] == previousPageName) {
						this.currentPageIndex = i;
						break;
					}
				}
				this.refreshVisual();
			},
			onFinishClickHandler() {
				var currentPage = this.$refs[this.pageList[this.currentPageIndex]];
				this.scope[this.pageList[this.currentPageIndex]] = currentPage.getReturnData();
				var data = {
					"json": JSON.stringify(this.scope)
				};
				var that = this;
				restUtil.postAction(this,"webide/reportwizarddialog/onFinish", data).then(
					function(response) {
						if (response.data.code == 1) {
							if (response.data.data.reportType == "detailReport") {
								that.$store.state.webIDE.$refs.mainPageContainer.loadPage({
									"name": response.data.data.name,
									"menuType": "clientpage",
									"pageCode": "detail-report-designer"
								}, {
									code: response.data.data.code
								});
							} else if (response.data.data.reportType == "summaryReport") {
								this.$store.state.webIDE.$refs.mainPageContainer.loadPage({
									"name": response.data.data.name,
									"menuType": "clientpage",
									"pageCode": "summary-report-designer"
								}, {
									code: response.data.data.code
								});
							}
							that.dialogVisible = false;
						} else {
							that.$alert(response.data.message, '提示')
						}
					});
			}
		},
	}
</script>

<style>
</style>
